<!DOCTYPE html>
<html lang="cn">
<head>
    <meta charset="UTF-8">
    <title>学生信息</title>
    <script type="text/javascript">
        let students = []; /* 所有学生信息 */
        function init() {
            let xhr = new XMLHttpRequest();
            xhr.open("get", "./../asset/data.xml", false);
            xhr.send();
            let xmlDoc = xhr.responseXML;
            students = xmlDoc.getElementsByTagName("student");  /* 通过标签名获取所有学生 */
            document.getElementById("student_id").value = students[0].getAttribute("id");
            document.getElementById("student_name").value = students[0].getAttribute("name");
        }
    </script>
</head>
<body onload="init()">
<label for="student_id">学号：</label><input type="text" id="student_id"><br>
<label for="student_name">姓名：</label><input type="text" id="student_name"><br>
<button type="button" onclick="next()">下一个</button>
<script type="text/javascript">
    let index = 0;

    function next() {
        index = (index + 1) % students.length;  /* 取余，使得index永远在数组中 */
        document.getElementById("student_id").value = students[index].getAttribute("id");
        document.getElementById("student_name").value = students[index].getAttribute("name");
    }
</script>
</body>
</html>